<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core">
    <h:head>
        <script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>
        
    </h:head>
    <h:form id="barrio">
        <center>
        <p:growl id="myGrowl" showDetail="true" globalOnly="true" life="2000"/>
        </center>
        <center>
            <p:panelGrid id="pgGestionarBarrio" style="width: 80%; font-size: 12px">
                <f:facet name="header">
                    <p:row>
                        <p:column colspan="6">Registro de Barrios</p:column>
                    </p:row>
                </f:facet>
                <p:row>
                    <p:column styleClass="celdaLabelMayor" >
                        <h:outputLabel  value="Nombre del Barrio:" />
                    </p:column>
                    <p:column>
                        <p:inputText id="nombreBarrio" value="#{beanGestionBarrios.barrio.nombreBarrio}" required="true" requiredMessage="#{msg.requiredField}"
                                                                             size="50" >
                        </p:inputText>
                        <p:message for="nombreBarrio" id="nombreBarriomsg"></p:message>
                        
                    </p:column>
                </p:row>
                <p:row>
                    <p:column styleClass="celdaLabelMayor">
                        <h:outputLabel  value="Localidad:" />
                    </p:column>
                     <p:column>
                         <p:inputText id="nombreLocalidad" value="#{beanGestionBarrios.barrio.localidadBarrio}" required="true" requiredMessage="#{msg.requiredField}"
                                                                             size="50" >
                        </p:inputText>
                         <p:message for="nombreLocalidad" id="nombreLocalidadmsg"></p:message>
                        
                    </p:column>
                </p:row>
                <p:row>
                    <p:column styleClass="celdaLabelMayor">
                        <h:outputLabel  value="Buscar:" />
                    </p:column>
                    <p:column>
                        <p:commandLink 
                            id="linkMapAgencia"
                            title="Ver mapa" onclick="mapDialogBarrio.show()">
                            <p:graphicImage value="#{beanGestionBarrios.globeIcon}"/>
                        </p:commandLink>
                    </p:column>
                </p:row>
                <p:row>
                    <p:column styleClass="celdaLabelMayor" >
                        <h:outputLabel  value="Estado:" />
                    </p:column>
                    <p:column colspan="9">
                        <p:selectOneRadio id="optionsBarrio" value="#{beanGestionBarrios.barrio.estado}">  
                            <f:selectItem itemLabel="Activo" itemValue="true" />  
                            <f:selectItem itemLabel="Inactivo" itemValue="false" />  
                        </p:selectOneRadio> 
                    </p:column>
                </p:row>

                <p:row >
                    <p:column colspan="5" style="text-align: left">
                        <p:commandButton value="Guardar" 
                                         process="@this,nombreBarrio,nombreLocalidad,optionsBarrio,optionsBarrio" 
                                         update="nombreLocalidadmsg,nombreBarrio,nombreLocalidad,nombreBarriomsg, myGrowl,resumenBarrios" actionListener="#{guardarBarrio}" />
                    </p:column>
                </p:row>
                
            </p:panelGrid>

        </center>

        <br></br>
        <br></br>
        <center>
            <p:dataTable id="resumenBarrios" var="barrio" style="font-size: 12px" 
                         value="#{beanGestionBarrios.listaBarrios}"
                         rowKey="#{barrio.idBarrio}"
                         emptyMessage="No se han encontrado barrios registrados" paginator="true" 
                         selectionMode="single"
                         selection="#{beanGestionBarrios.barrioSelected}">  

                 <p:ajax event="rowSelect" listener="#{beanGestionBarrios.rowSelected}"   
                            update="resumenBarrios,:menu:tabViewGeneral:tabViewMovilizacion:barrio:pgGestionarBarrio"  />  
                    <p:ajax event="rowUnselect" listener="#{beanGestionBarrios.onRow}" update="resumenBarrios, :menu:tabViewGeneral:tabViewMovilizacion:barrio:pgGestionarBarrio"/>  
                <f:facet name="header">  
                    <p:row>
                        <p:column >Resumen de los barrios</p:column>
                    </p:row>
                </f:facet>  

                    <p:column headerText="Nombre" filterBy="#{barrio.nombreBarrio}">  
                    <h:outputText value="#{barrio.nombreBarrio}"></h:outputText>
                </p:column>  

                    <p:column headerText="Localidad" filterBy="#{barrio.localidadBarrio}">  
                    <h:outputText value="#{barrio.localidadBarrio}"></h:outputText>
                </p:column>  
                    <p:column headerText="Estado">
                        <p:selectBooleanButton value="#{barrio.estado}" onLabel="Activo" offLabel="Inactivo" disabled="true" onIcon="ui-icon-check" offIcon="ui-icon-close">  </p:selectBooleanButton>    
                    </p:column>
            </p:dataTable>
            <p:row>
            <p:commandButton value="Actualizar " actionListener="#{actualizarBarrio}"
                                         process="@this"
                                         update="resumenBarrios" 
                                         />
        </p:row>
        </center>

    </h:form>
    

</html>
